<template>
	<view class="container">
		<!-- 全部 -->
		<myTab :list="list1" @itemClick='itemClick' v-if="false"></myTab>
		<view class="inner">
			<view class="inner-items" v-if="withList.length>0">
				<view class="inner-item" v-for="(item,index) in withList" :key="index">
					<image v-if="item.tx_type==1" src="https://farm-city.oss-cn-hangzhou.aliyuncs.com/static/order/zf-weixin.png" mode="widthFix" class="left-img"/>
					<image v-if="item.tx_type==2" src="https://farm-city.oss-cn-hangzhou.aliyuncs.com/static/order/zf-zfb.png" mode="widthFix" class="left-img"/>
					<image v-if="item.tx_type==3" src="https://farm-city.oss-cn-hangzhou.aliyuncs.com/static/images/bank_card.png" mode="widthFix" class="left-img"/>
					<view class="center">
						<view class="tit" v-if="item.tx_type==1">提现到微信</view>
						<view class="tit" v-if="item.tx_type==2">提现到支付宝</view>
						<view class="tit" v-if="item.tx_type==3">提现到银行卡</view>
						<view class="time">{{item.create_time}}</view>
					</view>
					<view class="right">
						<view class="status" :class="{'red':item.status!=1}">{{item.status_text}}</view>
						<view class="money">-{{item.money}}元</view>
					</view>
				</view>
				<u-loadmore :status="hasMore?'loading':'nomore'" />
			</view>
			<view class="empty-container" v-else>
				<u-empty text="暂无相关数据" icon="https://farm-city.oss-cn-hangzhou.aliyuncs.com/static/common/empty.png"></u-empty>
			</view>
		</view>
	</view>
</template>

<script>
	var _this
	export default {
		data() {
			return {
				list1: [{
					name: '全部',
				}, {
					name: '待审核',
				}, {
					name: '审核成功'
				}, {
					name: '审核失败'
				}],
				index: 0,
				withList: [],
				pageIndex:1,
				status:'0',
				hasMore:true
			}
		},
		onLoad() {
			_this=this
			this.withlist();
		},
		onReachBottom() {
			if(this.hasMore){
				this.pageIndex++
				this.withlist()
			}
		},
		methods: {
			itemClick(index) {
				this.status = index
				this.pageIndex = 1
				this.withList = []
				this.withlist()
			},
			//获取提现记录列表
			async withlist() {
				const params = {
					pageIndex:this.pageIndex,
					pageSize:20,
					status:this.status
				}
				const data = await _this.$post('api/get_tx_list',params)
				if(data.code==200){
					this.withList.push(...data.data.list)
					this.hasMore=data.data.list.length>=params.pageSize
				}else{
					this.hasMore=false
				}
			}
		}
	}
</script>
<style lang="scss" scoped>
	.container{
		padding: 0;
		.inner{
			padding: 20rpx 30rpx 0 30rpx;
			.inner-item{
				@include flex-box(row);
				background: #fff;
				border-radius: 20rpx;
				padding: 30rpx;
				margin-bottom: 20rpx;
				.left-img{
					width: 44rpx;
					align-self: center;
					margin-right: 20rpx;
				}
				.center{
					flex: 1;
					.tit{
						font-size: 28rpx;
						font-weight: 500;
					}
					.time{
						color: $color-080524;
						font-size: 24rpx;
						margin-top: 10rpx;
					}
				}
				.right{
					text-align: right;
					.status{
						color: $theme-28C445;
					}
					.money{
						color: $theme-28C445;
						margin-top: 10rpx;
					}
					.red{
						color: $theme-F94A36;
					}
				}
			}
		}
	}
</style>
